<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'Sgtz.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/hplus/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/hplus/css/plugins/bootstrap-table/bootstrap-table.min.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/hplus/css/plugins/sweetalert/sweetalert.css" />
<script type="text/javascript"
	src="${pageContext.request.contextPath}/hplus/js/jquery.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/hplus/js/bootstrap.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/hplus/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/hplus/js/plugins/sweetalert/sweetalert.min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/hplus/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

<link rel="shortcut icon"
	href="${pageContext.request.contextPath}/hplus/favicon.ico">
<link
	href="${pageContext.request.contextPath}/hplus/css/bootstrap.min14ed.css?v=3.3.6"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath}/hplus/css/font-awesome.min93e3.css?v=4.4.0"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath}/hplus/css/animate.min.css"
	rel="stylesheet">
<link
	href="${pageContext.request.contextPath}/hplus/css/style.min862f.css?v=4.1.0"
	rel="stylesheet">
<link href="${pageContext.request.contextPath}/css/Sgtz.css"
	rel="stylesheet">
<script type="text/javascript" src="js/jquery.form.js"></script>


<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jquery-easyui-1.5.5.1/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jquery-easyui-1.5.5.1/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/jquery-easyui-1.5.5.1/demo/demo.css">
	<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.5.1/jquery.easyui.min.js"></script>

</head>
<script type="text/javascript">

	function uploadPic() {
		var current = $("#file").val();
		var id = $("#yin").val();
		if (current == null || current == "" || current == undefined) {
			alert("请选择图片");
			return false;
		}
		// 上传设置  
		var options = {
			// 规定把请求发送到那个URL  
			url : "imgesservlet.do?met=jia",
			// 请求方式  
			type : "post",
			data : {
				"id" : id
			},
			// 服务器响应的数据类型  
			dataType : "json",
			// 请求成功时执行的回调函数  
			success : function(data) {
				//, status, xhr
				// 图片显示地址  
				document.location.reload();
			}
		};
		$("#jvForm2").ajaxSubmit(options);
	}

	function da(obj) {
		var lian = $(obj).children("img").attr('src');
		$('#w').window('open');

		$("#dadada").attr("src", lian);


	}
	function rollImg(o) {
		/* 获取当前页面的缩放比
		 若未设置zoom缩放比，则为默认100%，即1，原图大小 */
		
		var zoom = parseInt(o.style.zoom) || 100;
		/* event.wheelDelta 获取滚轮滚动值并将滚动值叠加给缩放比zoom
		    wheelDelta统一为±120，其中正数表示为向上滚动，负数表示向下滚动
		*/
		zoom += event.wheelDelta / 12;
		/* 如果缩放比大于0，则将缩放比加载到页面元素 */
		if (zoom > 0)
			o.style.zoom = zoom + '%';
		/* 如果缩放比不大于0，则返回false，不执行操作 */
		return false;
	}
	function del(obj,id){
		
		if(confirm("是否删除？")){
			$.post("imgesservlet.do?met=del",{"id":id},function(result){
				if(result==1){
					$(obj).parent().remove();
				}
			})
		}else{
			alert("已取消");
		}
		
	}
</script>
<body>
	<input type="hidden" id="yin2" />
	<div id="div1">
		<button type="button" class="btn"
			onclick="location='baoshow.jsp'">后退</button>
		<button type="button" class="btn"
			data-toggle="modal" data-target="#myModal">添加图纸</button>
	</div>
	<br>
	<div class="row" id="row">
		<c:forEach items="${list }" var="list">
			<div class="col-xs-6 col-md-3">
				<span class="glyphicon glyphicon-remove" onclick="del(this,${list.id})"></span>
				<a onclick="da(this)" class="thumbnail"> <img src="${list.img }">
				</a>
			</div>
		</c:forEach>
	</div>

	<!-- Modal -->
	<div class="modal fade" id="myModal">
		<div class="modal-dialog" style="width:600,height:303px;"
			role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">施工图纸添加</h4>
				</div>
				<div class="modal-body">
					<!-- form开始 -->
					<form id="jvForm2" action="" method="post"
						enctype="multipart/form-data">
						<input type="hidden" id="yin" value="${id }" />
						<div class="form-group">
							<label for="file" style="float: left;">图片地址:</label> <input
								id="file" type="file" name="file" class="form-control">
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button onclick="uploadPic()" type="button" class="btn btn-primary">提交</button>
				</div>
			</div>
		</div>
	</div>
	<!-- 图片放大 -->
	<div id="w" class="easyui-window" title="Modal Window" data-options="modal:true,closed:true,iconCls:'icon-save'" style="width:800px;height:800px;padding:10px;">
		<img id="dadada" onmousewheel="return rollImg(this)">
	</div>
	

	<!-- <div style="" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog"
		aria-labelledby="myLargeModalLabel" id="myModal99">
		<div class="modal-dialog modal-lg" role="document">
			<div></div>
		</div>
	</div> -->

</body>
</html>
